<template>
  <div class="app-container">
      <el-form ref="form" :model="form" :rules="rules" label-width="80px">
          <el-row>
              <el-col :span="24">
                  <el-form-item label="封面图片">
                      <image-upload v-model="form.img" />
                  </el-form-item>
              </el-col>
              <el-col :span="24">
                  <el-form-item label="标题" prop="title">
                      <el-input v-model="form.title" placeholder="请输入标题" />
                  </el-form-item>
              </el-col>
              <!--  目的地选择 -->

              <!-- <el-col :span="6">
                  <el-form-item label="目的地" prop="destinationName">
                      <el-select placeholder="请选择目的地" filterable>
                          <el-option-group v-for="group in options" :key="group.label" :label="group.label">
                              <el-option v-for="item in group.options" :key="item.value" :label="item.label"
                                  :value="item.value">
                              </el-option>
                          </el-option-group>
                      </el-select>
                  </el-form-item>
              </el-col> -->
              <el-col :span="24">
                  <el-form-item label="目的地" prop="destinationName">
                      <el-input v-model="form.destinationName" placeholder="请输入目的地" />
                  </el-form-item>
              </el-col>

              <el-col :span="6">
                  <el-form-item label="状态" prop="state">
                      <el-select v-model="form.state" placeholder="请选择状态"  @change="handleStateChange" clearable>
                          <el-option value="0" label="待发布" />
                          <el-option value="1" label="已发布" />
                      </el-select>
                  </el-form-item>
              </el-col>

              <el-col :span="24">
                  <el-form-item label="内容">
                      <editor v-model="form.detailDoubt" :min-height="192" />
                  </el-form-item>
              </el-col>

          </el-row>

      </el-form>
      <el-row>
          <el-col :span="24" align="right">
              <el-button type="primary" @click="handleSave">确 认</el-button>
              <el-button @click="handleCancel">取 消</el-button>
          </el-col>
      </el-row>
  </div>
</template>

<script>
import { addQuestion, updateQuestion, getQuestion } from "@/api/wolf2w/question";
export default {
  name: "questionAdd",
  data() {
      return {
          state:"",
          form: {
          },
          // 表单校验
          rules: {
          },
          // 下拉选项数据  
          // options: [
          //     {
          //         label: '国内',
          //         options: [
          //             { value: 'hangzhou', label: '杭州' },
          //             { value: 'chengdu', label: '成都' }
          //         ]
          //     },
          //     {
          //         label: '热门城市',
          //         options: [
          //             { value: 'beijing', label: '北京' },
          //             { value: 'shanghai', label: '上海' }
          //         ]
          //     },
          //     {
          //         label: '国外',
          //         options: [
          //             { value: 'newyork', label: '纽约' },
          //             { value: 'london', label: '伦敦' }
          //         ]
          //     }
          // ]
      };
  },
  created() {
      // this.getList(0);
      // this.getList(1);
      // this.getList(2);
  },
  methods: {
      //获取目的地列表
      // getList(type) {
      //     if (type >= 0 && type < this.options.length) {
      //         listDestination({ type: type }).then(resp => {
      //             this.options[type].options = resp.data; // 更新对应对象的options属性  
      //             console.log(resp.data);
      //         }).catch(error => {
      //             console.error('Error fetching data:', error);
      //         });
      //     } else {
      //         console.warn(`Invalid type: ${type}`);
      //     }
      // },

      handleStateChange(value) {
          // console.log(this.form.state);
          
          // 触发一个自定义事件，将新的状态值传递给父组件  
          this.$emit('update:state', value);
      } ,

      handleSave() {
          this.form['content.content'] = this.form.txt;
          let store = this.$store;
          let route = this.$route
          let router = this.$router
          addQuestion(this.form).then(resp => {
              this.$modal.confirm('添加成功').then(function () {
                  // 调用全局挂载的方法，关闭当前页
                  store.dispatch("tagsView/delView", route);
                  // 返回上一步路由
                  router.go(-1)
              })
          })


      },
      handleCancel() {
          this.$store.dispatch("tagsView/delView", this.$route);
          // 返回上一步路由
          this.$router.go(-1)
      }
  }
};
</script>